{% extends "base.html" %}

{% load table_row_highlight %}

{% block extrahead %}
<script type='text/javascript' src='/appmedia/js/routines.js'></script>
<script type='text/javascript' src='/appmedia/js/index.js'></script>

<script language="JavaScript" type="text/javascript">
	var in_ajax = 0;
	document.onmousedown=dragHandler;
</script>

<style>
	textarea {
		width:500px;
		height: 100px;
	}
</style>
{% endblock %}

{% block adds %}

{% endblock %}

{% block content %}
	<!-- <div class="form_layer">  -->
		<b style="margin: 0 1px;height:1px;background:#fad163;display:block;overflow: hidden"></b>
		<p class="about help_text" style="font-size:12px; font-weight: bold;background:#fad163; margin:0px; padding:4px;">
		{{ motivation|escape }} 
		<span class="light">
			{% if motivation.author %}
				{{ motivation.author }}
			{% else %}
				Unknown author
			{% endif %}
		</span>
		</p>
		<b style="margin: 0 1px;height:1px;background:#fad163;display:block;overflow: hidden"></b>
		
		<h1 class="help_header">
		Active tasks
		</h1>
		
		<p class="about help_text">
		By fixing idea on a paper half of work is done, you moving forward. 
		Simple
		<a class="toolbar" id="add_task" href="javascript:AddItem('add_task', 'task')">
				<img src="/appmedia/add.gif">
				write you want to do</a>.
		<br/> 
		You don't need specify a couple of things at one time. Idea needs only name.
		</p>
				
		<div id="Menu">
			<a class="toolbar" id="add_task" href="javascript:AddItem('add_task', 'task')">
				<img src="/appmedia/add.gif">
				write you want to do
			</a>
			::
			<a class="toolbar" id="archive_tasks" href="/archive_all_done_tasks/" title="You don't need delete done tasks. Archiving is best choise.">
				<img src="/appmedia/delete.gif">
				archive all done
			</a>
			::
			<a class="toolbar" id="share_tasks" href="/share_tasks/">
				<img src="/appmedia/share.gif">
				share tasks
			</a>
			::
			<a class="toolbar" id="export_tasks" href="/export_tasks/">
				<img src="/appmedia/csv.gif">
				export to CSV
			</a>
		</div>
	
	{% if tasks %}
	
		<div id="tasks">
			<table cellspacing="0" style="table-layout: fixed;">
				<tr id="Menu">
					<th class="caption" style="width:18px;">
						<img src="/appmedia/yes.gif">
					</th>
					<th class="caption">
						Summary
					</th>
					<th class="caption" style="width:70px;">
						Date
					</th>
					<th class="caption" style="width:70px;">
						Time&nbsp;spent
					</th>
					<th class="caption" style="width:44px;">
						Archive
					</th>
					<th class="caption" style="width:44px;">
						Delete
					</th>
				</tr>
	
				{% for task in tasks %}
					<tr id="task_{{task.id}}">
							<td class="odd" nowrap width="16">
								{% if task.done %}
									<img id="task_is_done{{task.id}}" src="/appmedia/done.gif" onclick="javascript:TaskIsDone({{task.id}})" alt="done" />
								{% else %}
									<img id="task_is_done{{task.id}}" src="/appmedia/undone.gif" onclick="javascript:TaskIsDone({{task.id}})" alt="undone" title="Click to mark task as done" />
								{% endif %}
							</td>
							<td class="odd" width="500">
								<a href="javascript:EditTaskInline({{task.id}})" title="{{task.text}}">{{task.name}}</a>
								{% if task.project %}
									<a class="light" href="/project/edit/{{task.project.id}}">
									- {{task.project}}
									</a>
								{% endif %}
								{% if task.text %}
									<span class="light">
									- {{task.text|escape}}
									</span>
								{% endif %}
							</td>
							<td class="odd"  align="center">
								{% if task.task_date %}
									{{task.task_date}}
								{% endif %}
								&nbsp;
							</td>
							<td class="odd" align="right" style="width:60px;padding-right:10px">
								{{task.time_spent|floatformat:1}} h
							</td>
							<td class="odd" width="16" align="center">
								<a href="/task/archive/{{task.id}}/"><img src="/appmedia/delete.gif" title="Archive task"></a>
							</td>
							<td class="odd" width="16" align="center">
								<a href="/task/delete/{{task.id}}/"><img src="/appmedia/delete2.gif" title="Delete task"></a>
							</td>
						</tr>
				{% endfor %}
			</table>
		</div>
	{% endif %}
	<!-- </div>  -->
	
	<iframe id="our_hidden_frame" name="our_hidden_frame" style="display:none;">
	
	</iframe>
{% endblock %}



{% block header_content %}
	<div id="add_item_wnd" style="visibility:hidden;display:none;">
		<form id="add_item_form" method="POST" action=''>
		<table cellspacing="0">
			<tr>
				<td colspan="2">
					<h1 id="add_item_caption" style="margin-top:0px;margin-bottom:2px">New item</h1>
				</td>
				<td align="right">
					<a class="button" style="margin:0px" href="javascript:HideWnd()">X</a>
				</td>
			</tr>
			<tr>
				<td align="right" colspan="3">
					Name:&nbsp;&nbsp;&nbsp;&nbsp;<input id="id_name" name="name" type="text" style="width:255px">
					<input type="hidden" name="time_spent" value="0.0">
				</td>
			</tr>
			<tr>
				<td colspan="3">
					<input class="submit" type="submit" value="Save">
					<a href="/task/add/" style="border-bottom: 1px solid">
					Edit task details &gt;&gt;
					</a>
				</td>
			</tr>
		</table>
		</form>
	</div>
{% endblock %}
